Created by Microlender ACCION USA, this presentation shows the step by step process to create a website for free using Yola.com.

1. Yola Step-by Step Tutorial
Lending. Supporting. Inspiring.

2. Before Beginning
Some prerequisites:
• Email Account
• Marketing Plan
• Site-specific content
• Pictures
• Product Descriptions
• Contact Information
www.accionusa.org 2

3. Step 1. Site Goals
• Before you even start thinking about building a
website, you have to do some soul searching
– Why do you want to make a website?
– What is the purpose of your website?
– Who will visit your website?
– What will they gain?
– What is in it for you?
• Writing the answers down will help focus you through
this journey
www.accionusa.org 3

4. Step 1. Story
Sample story:
• Thomas and Jan are two hometown friends that opened a
small local bakery about a year ago
• Their breads are made from a secret recipe passed down from
Jan’s grandmother and are hailed by locals as the best kept
secret in the area
• Still, their customer base (and profits) have stayed steady for
months and they are looking for ways to expand without
adding more branches
www.accionusa.org 4

5. Step 1. Site Goals
• Start in ‘expansion’ mode
– Brainstorm – spend some quality time thinking about your goals
– No idea is ‘too-big’ or ‘too-hard’ yet
– Write down everything
• End in ‘strategic’ mode
– What will help me attract clients? Increase revenue?
– What are the resources I have? How long will it take to carry
out my goals?
www.accionusa.org 5

6. Step 1. Page by Page Site Plan
• Draw out a page by page design of your site
– What pages do you want to show? Site name?
– How will links work? Where will text and pictures go? Where
do we incorporate widgets?
www.accionusa.org 6

7. Step 2. Create Your Account
• Using your preferred email address, go to Yola.com
and create an account
• Choose the ‘Yola free’ option
www.accionusa.org 7

8. Step 2. Choose a Style
• With so many options, it is easy to get lost here
• Choose a free style to best represents the image you
want to convey. Additionally, you can purchase
Premium styles
Once you have picked out the right
style for you, click the preview
button to view sample content
www.accionusa.org 8

9. Step 2. Confirm your style
• Click to confirm your style
• You will need to choose a name for your site. Let’s
“Build Our Site” now, we’ll come back to the site
name.
www.accionusa.org 9

10. Step 3. Build Your Site
• Since we spent time on our site plan, building the
website with Yola can be fun and easy!
• We’ll build one page at a time, utilizing some different
tools.
• Afterwards we will incorporate our widgets and
publish our site
www.accionusa.org 10

11. Step 3. Main Page
• Most important page in your site
• Customers will come to a decision about whether to
stay based on how your site looks.
• Its important to look to your marketing plan for
guidance on your strengths. Emphasize them here.
www.accionusa.org 11

12. Step 3. Drag and Drop
• Drag and drop a text
box from your content
sidebar
• Place it in the center of
the page
www.accionusa.org 12

13. Step 3. Adding Text
• Put in your mission statement. This is a the main
message you want your users to read. It should entice
the user to stay.
• You can format this text to give emphasis to certain
words
www.accionusa.org 13

14. Step 3. Adding Pictures
• Drag and drop the ‘Picture’ widget
• Upload pictures from your computer to the website
• You get 1GB of space for images and content.
www.accionusa.org 14

15. Step 3. Combining Content Widgets
• You’ll begin to see how we can build an enticing site
piece by piece, easily.
www.accionusa.org 15

16. Step 3. About Us
• For the sample site, we will emphasize our business
image by describing our history and our values
• Let’s drag another text widget below the picture
widget we just added.
www.accionusa.org 16

17. Step 3. Additional Content
• This text is less pronounced than our mission
statement. However, we highlight keywords.
www.accionusa.org 17

18. Step 3. Adding Pages
• Following our site plan, we can add some new pages
to guide the user to different types of information
about our business
• Add a new web page
and name it
www.accionusa.org 18

19. Step 3. Columns
• One useful way to organize your site is by using
columns.
• This will separate content into two sections on your
site.
• Here we will put product pictures on one side and
descriptions on the other.
www.accionusa.org 19

20. Step 3. Content in Columns
• Drag and drop the column divider into the site
• Then, use the text and picture components to populate the
columns with data
• You can put columns inside columns, and stack them for
effect
www.accionusa.org 20

21. Step 3. Utilizing Columns
www.accionusa.org 21

22. Step 3. Adding Widgets
• Our site plan calls for putting a map on our contact
page.
• The way to do this is to incorporate widgets into our
website
• A widget takes up minimal space on your website and
allows you to customize a popular tool, such as
Google Maps or PayPal, to your business
• For our map, we will be using Google Maps
www.accionusa.org 22

23. Step 3. Adding Widgets
• Common widgets can be found in the
content sidebar
• Each needs different inputs
• Many require you to sign-up on
partner sites to utilize them
www.accionusa.org 23

24. Step 3. Adding Widgets
• Add an address and search to focus the map to your
location
• Helps customers find you
www.accionusa.org 24

25. Step 3. Adding Widgets
• Some widgets provide specialized services that can help you
enhance the user experience
• For our sample site, we’ll use
Social Media Badge – Spread the word through different outlets
Google Translator – Accommodate different users
PayPal – Increase revenue
Easy Comments – Allow users to comment on your site
www.accionusa.org 25

26. Step 3. Adding Widgets
• Some widgets can be added with minimal additional
info required
www.accionusa.org 26

27. Step 3. Adding Widgets
• Some widgets, like PayPal, require you to have
accounts created on the parent site
• PayPal is a useful and secure server that you should
consider to enable online purchases
www.accionusa.org 27

28. Step 3. Adding Widgets
• Some widgets, like Easy Comments, will look sparse
when you add them in the site editor
• Users will add content to these widgets when you go
live with your site
www.accionusa.org 28

29. Review our Progress
• Let’s review our progress
• Publish your site by hitting “Update my Site”
• We’ll switch over to a Yola-created website:
http://brooklynsamplebakery.yolasite.com/
www.accionusa.org 29

30. Advanced Topics
• Check out the Yola website for information on more
advanced topics
http://www.yola.com/support.html
- Some topics worth checking out:
- Getting your own domain name
- Analytics and Optimization
- Picture Galleries
- Linking to PayPal and other merchant tools
www.accionusa.org 30

31. Questions?
www.accionusa.org 31